<template>
    <div class="index">
        <div class="bai">
            <div class="twoicon">
                <router-link to="">
                    <yd-icon name="feedback" style="font-size:0.35rem"></yd-icon>
                </router-link>
                <router-link to="/setting">
                    <yd-icon name="setting" style="font-size:0.35rem;margin-left: 0.2rem;"></yd-icon>
                </router-link>
            </div>
            <div class="uermsg">
                <div class="img">
                    <img src="http://static.ydcss.com/ydui/img/logo.pn" alt=""/>
                </div>
                <div class="descright">
                    <div class="desc_msg">
                        <div class="namemsg">包子XXX</div>
                        <div class="hrefmsg">完善信息</div>
                    </div>
                    <div class="vipuser">
                        <yd-button size="mini" bgcolor="#ccc" color="#000" type="primary" shape="circle">达人尊享会员</yd-button>
                    </div>
                </div>
            </div>
        </div>
        <div class="bai tops">
            <div class="orders">
                <yd-cell-group title="">
                    <yd-cell-item arrow href="#" type="link">
                        <yd-icon name="order" size=".42rem"></yd-icon>
                        <span slot="left">我的订单</span>
                        <span slot="right">查看全部订单</span>
                    </yd-cell-item>
                </yd-cell-group>
            </div>
            <div class="orderStatus">
                <yd-tabbar>
                    <yd-tabbar-item title="待付款" link="#">
                        <img slot="icon" style="height: 0.5rem;" src="http://static.ydcss.com/ydui/img/logo.png">
                    </yd-tabbar-item>
                    <yd-tabbar-item title="待发货" link="#">
                        <img slot="icon" style="height: 0.5rem;" src="http://static.ydcss.com/ydui/img/logo.png">
                    </yd-tabbar-item>
                    <yd-tabbar-item title="待收获" link="#">
                        <img slot="icon" style="height: 0.5rem;" src="http://static.ydcss.com/ydui/img/logo.png">
                    </yd-tabbar-item>
                    <yd-tabbar-item title="待评价" link="#">
                        <img slot="icon" style="height: 0.5rem;" src="http://static.ydcss.com/ydui/img/logo.png">
                    </yd-tabbar-item>
                    <yd-tabbar-item title="退款/售后" link="#">
                        <img slot="icon" style="height: 0.5rem;" src="http://static.ydcss.com/ydui/img/logo.png">
                    </yd-tabbar-item>
                </yd-tabbar>
            </div>
        </div>
        <div class="lists tops">
            <yd-cell-group title="">
                <yd-cell-item arrow href="#" type="link">
                    <yd-icon slot="icon" name="order" size=".42rem"></yd-icon>
                    <span slot="left">会员积分</span>
                    <span slot="right">5000积分</span>
                </yd-cell-item>
            </yd-cell-group>
            <yd-cell-group title="">
                <yd-cell-item arrow href="#" type="link">
                    <yd-icon slot="icon" name="order" size=".42rem"></yd-icon>
                    <span slot="left">扶贫码</span>
                    <span slot="right">0.01</span>
                </yd-cell-item>
            </yd-cell-group>
            <yd-cell-group title="">
                <yd-cell-item arrow href="#" type="link">
                    <yd-icon slot="icon" name="order" size=".42rem"></yd-icon>
                    <span slot="left">我的收藏</span>
                </yd-cell-item>
            </yd-cell-group>
            <yd-cell-group title="">
                <yd-cell-item arrow href="/address" type="link">
                    <yd-icon slot="icon" name="order" size=".42rem"></yd-icon>
                    <span slot="left">地址收藏</span>
                </yd-cell-item>
            </yd-cell-group>
        </div>
        <div class="lists tops">
            <yd-cell-group title="">
                <yd-cell-item arrow href="/setting" type="link">
                    <yd-icon slot="icon" name="order" size=".42rem"></yd-icon>
                    <span slot="left">设置</span>
                </yd-cell-item>
                <yd-cell-item arrow href="/helpcenter" type="link">
                    <yd-icon slot="icon" name="order" size=".42rem"></yd-icon>
                    <span slot="left">帮助中心</span>
                </yd-cell-item>
            </yd-cell-group>
        </div>
    </div>
</template>
<script>
export default {
  name: 'user'
}
</script>
<style lang="scss" scoped>
.index{
    padding: 0 #{$padding};
    .bai{
        background: #fff;
        .twoicon{
            text-align: right;
            margin-right: 0.3rem;
            padding: 0.1rem 0 0.2rem;
        }
        .uermsg{
            padding: 0.1rem 1rem 0.55rem;
            display: flex;
            align-items: center;
            justify-content: space-evenly;
            .img{
                width: 0.70rem;
                height: 0.70rem;
                border-radius: 50%;
                background-color: #000;
                .img img{
                    display: block;
                    width: 100%;
                    height: 100%;
                }
            }
            .descright{
                margin-left: 0.01rem;
                .desc_msg{
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    .namemsg{
                        margin-right: 0.4rem;
                    }
                    .hrefmsg{
                        color: #f00;
                    }
                }
                .vipuser{
                    margin-top: 0.2rem;
                    .yd-btn-mini.yd-btn-disabled.yd-btn-circle{
                        font-size: 0.01rem;
                    }
                }
            }
        }
    }
    .tops{
        margin-top: 0.2rem;
        .orders{
            .yd-cell-box {
                margin-bottom: 0;
            }
        }
        .orderStatus{
            .yd-grids-5 .yd-grids-item{
                font-size: 0.2rem;
            }
        }
    }
    .lists{
        .yd-cell-box {
            margin-bottom: 0rem;
            .yd-cell .yd-cell-item{
                border-bottom: 0.01rem solid #f5f5f5;
            }
        }
    }
}
</style>
